<template>
  <div class="warning-map">
    <div class="mapWarp">
      <warning-map/>
    </div>
    <div class="mapListWarp">
      <map-list/>
    </div>
  </div>
</template>

<script>
import WarningMap from '@/views/earlyWarning/earlyWarningMap/components/WarningMap'
import MapList from '@/views/earlyWarning/earlyWarningMap/components/MapList'
export default {
  name: 'Index',
  components: {
    WarningMap,
    MapList
  }
}
</script>

<style lang="scss" scoped>
.warning-map {
  width: 100%;
  height: 100%;
  position: relative;

  .mapWarp {
    width: 100%;
    height: 100%;

  }

  .mapListWarp {
    width: 360px;
    height: 90%;
    min-height: 100%;
    border-radius: 10px;
    position: absolute;
    top: 50%;
    right: 50px;
    transform: translate(0, -50%);
  }
}
</style>
